<template>

  <div>

<!--    rules 校验的规则
        ref="form"   找到   原生  dom节点
-->
    <el-form :model="form" label-width="150px"    :rules="rules" ref="form">

      <el-row>
        <el-col :span="12">
          <el-form-item label="姓名" prop="name">
            <el-input v-model="form.name" placeholder="请输入姓名"/>
          </el-form-item>

        </el-col>
        <el-col :span="12">
          <el-form-item label="性别" prop="gender">
            <el-select v-model="form.gender" placeholder="请选择性别">
              <el-option
                v-for="dict in genderList"
                :key="dict.code"
                :label="dict.cation"
                :value="dict.code"
              ></el-option>
            </el-select>
          </el-form-item>

        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">

          <el-form-item label="身份证号" prop="idno">
            <el-input v-model="form.idno" placeholder="请输入身份证号"/>
          </el-form-item>
    </el-col>
        <el-col :span="12">
          <el-form-item label="出生日期" prop="birthday">
            <el-date-picker clearable
                            v-model="form.birthday"
                            type="date"
                            value-format="yyyy-MM-dd"
                            placeholder="请选择出生日期">
            </el-date-picker>
          </el-form-item>

        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="年龄" prop="age">
            <el-input v-model="form.age" placeholder="请输入年龄"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="家庭住址" prop="address">
            <el-input v-model="form.address" placeholder="请输入家庭住址"/>
          </el-form-item>
        </el-col>
      </el-row>


      <el-row>
        <el-col :span="12">
          <el-form-item label="挂号级别" prop="regsitLevelId">


            <el-select  v-model="form.registLevel"  placeholder="请选择挂号级别" @change="changeRegisterLevel">
              <el-option
                v-for="item in levelList"
                :key="item.registLevel"
                :label="item.caption"
                :value="item.registLevel">
              </el-option>
            </el-select>
          </el-form-item>

        </el-col>
        <el-col :span="12">

          <el-form-item label="挂号科室" prop="deptId">
            <el-select  v-model="form.deptId"  placeholder="请选择" @change="chageDept">
              <el-option
                v-for="item in deptList"
                :key="item.deptId"
                :label="item.deptName"
                :value="item.deptId">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">

          <el-form-item label="看诊医生" prop="doctorId">
            <!--          <el-input v-model="form.doctorId" placeholder="请输入看诊医生"/>-->
            <el-select v-model="form.doctorId" placeholder="请选择看诊医生">
              <el-option
                v-for="doctor in doctorList"
                :key="doctor.userid"
                :label="doctor.nickname"
                :value="doctor.userid"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="看诊时间" prop="visittime">
            <el-date-picker clearable
                            v-model="form.visitTime"
                            type="date"
                            value-format="yyyy-MM-dd"
                            placeholder="请选择看诊时间">
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="是否需要病历本" prop="book">
            <el-radio-group  @input="calcFee"  v-model="form.book"    size="mini">
                  <el-radio-button v-for="item in yornList":label="item.code">{{item.cation}}</el-radio-button>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">

          <el-form-item label="挂号费用" prop="fee">
            <el-input v-model="form.fee" readonly/>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item>
            <el-button type="primary" @click="save()">挂号</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>


  </div>

</template>

<script>
import {getForm, save, update,initRegist,queryDoctors} from "@/api/regist/regist";

export default {
  name: 'DeptEdid',
  props: ["id"],
  data() {
    return {
      genderList:[],
      yornList:[],
      deptList:[],
      levelList:[],
      doctorList:[],
      form: {
        checkId: '',
        name: '',
        price: '',
      },
      rules: {
        name: [
          { required: true, message: '请输入患者姓名', trigger: 'blur' },
          { min: 3, max: 10, message: '长度在 3 到 10 个字符', trigger: 'blur' }
        ],
        gender: [
          { required: true, message: '请选择性别', trigger: 'change' }
          ],
        fee:[
          {required:true}
        ]
        // ],
        // date1: [
        //   { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
        // ],
        // date2: [
        //   { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
        // ],
        // type: [
        //   { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
        // ],
        // resource: [
        //   { required: true, message: '请选择活动资源', trigger: 'change' }
        // ],
        // desc: [
        //   { required: true, message: '请填写活动形式', trigger: 'blur' }
        // ]
      }
    }
  },
  created() {
    if (this.id) {
      this.getForm();
    }
    //需要初始化 性别的数据， this.getConstantsItem("gender')
    //         是否      this.getConstantsItem("YorN')
   this.init()

  },
  methods: {
    calcFee(){
      this.levelList.forEach((item,index)=>{
            if(this.form.registLevel == item.registLevel){
               //级别的费用  +  病历本是否要钱 费用
                this.form.fee =  item.fee + (this.form.book == 'Y'?1:0);
                return false;
            }
      })
    },
    changeRegisterLevel(){
      this.queryDoctors();
      this.calcFee()

    },
    queryDoctors(){
      let params = {
        registLevel:this.form.registLevel,
        deptId:this.form.deptId
      }
      queryDoctors(params).then(doctorList=>{
          this.doctorList = doctorList;
      })
    },
    chageDept(deptId){
      this.queryDoctors();

      this.deptList.forEach((item,ind)=>{
        if( item.deptId == deptId){
          this.form.deptName = item.deptName
        }
      })
    },
    init(){
      this.getConstantsItem("gender"  ,(list)=>{
        this.genderList  = list;
      })
      this.getConstantsItem("YorN"  ,(list)=>{
        this.yornList  = list;
      })

      //挂号级别，科室
      // initRegist()  Promise 对象
      initRegist().then(res=>{
          this.deptList =  res.deptList
          this.levelList =  res.levelList
      })






    },
    //修改的时候初始化使用
    getForm() {
      getForm(this.id).then((form) => {
        this.form = form;
      }).catch((e) => {
        console.log("失败的情况", e)
      });

    },
    save() {
      this.$refs['form'].validate((valid) => {
          if(valid){
                let promise = null;

                // delete  this.form.createtime;

                if (this.id) {
                  promise = update(this.form);
                } else {
                  promise = save(this.form);
                }
                // form /
                promise.then((success) => {
                  if (success) {
                    this.$message.success("保存成功");
                    //关掉自己
                    this.$emit("update:visible", false);
                    this.$emit("close");
                  }
                }).catch((e) => {
                  console.log("失败的情况", e)
                });
          }
      });





    }
  }
}


</script>

<style scoped>


</style>
